<template>
    <div class="choice-options">
        <h2 v-if="hint !== ''">{{hint}}</h2>
        <cube-radio-group v-model="selected" :options="options">
        </cube-radio-group>
    </div>
</template>

<script>
// 选择题选项
export default {
    name: "choice-options",
    data() {
      return {
          selected: ''
      }
    },
    props: {
        // 选项
        options: {
            type: Array,
            default() {
                return [
                    {
                        label: '111',
                        value: 11
                    },
                    {
                        label: '222222222222222222222222222222222222222',
                        value: 22
                    }
                    ]
            }
        },
        // 提示文字
        hint: {
            type: String,
            default: ''
        },
        // 选择的value值
        value: {
            type: String,
            default: ""
        }
    },
    watch: {
        selected(value) {
            this.$emit('change',value)
        }
    }
}
</script>

<style scoped lang="less">
    @import "@/theme.less";
    .choice-options{
        font-size: @font-middle;
        h2{
            height: 20px;
            line-height: 20px;
            text-indent: 10px;
            color: @assist-color1;
        }
    }
</style>
